<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>danceWeui框架</title>
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">
	<meta content="yes" name="apple-mobile-web-app-capable">
	<meta content="black" name="apple-mobile-web-app-status-bar-style">
	<meta content="telephone=no" name="format-detection">
	<link rel="stylesheet" href="../../css/weui.min.css">
	<link rel="stylesheet" href="../../css/danceWeui.css">
	<link rel="stylesheet" href="../../../iconfont/iconfont.css">
	<link rel="stylesheet" href="css/style.css">
	<style>
		table{ border-collapse:collapse; border:1px solid #e7e7e7; width: 100%;}
		table tr td{ border:1px solid #e7e7e7; padding:10px;}
		table th{ padding:15px;}
	</style>
</head>
<body>

<div class="daui-navbar bg-gradual-blue">
	<div class="daui-navbar__hd">
		<a href="javascript:history.back(-1)"><i class="iconfontzz icon-fanhuijiantou"></i>返回</a>
	</div>
	<div class="daui-navbar__bd">基础CSS类</div>
</div>

<div class="page__hd">
	<h1 class="page__hd_title">
		基础CSS类
	</h1>
	<p class="page__hd_desc">单选、复选、开关等</p>
</div>
	
<table>
	<tr>
		<th colspan="2">页面</th>
	</tr>
	<tr>
		<td>.container</td>
		<td>页面开始类</td>
	</tr>
	<tr>
		<td>.page__bg</td>
		<td>灰色页面背景</td>
	</tr>
	<tr>
		<td>.page__hd</td>
		<td>四边20px</td>
	</tr>
	<tr>
		<td>.page__bd</td>
		<td>四边为0</td>
	</tr>
	<tr>
		<td>.page__bd_15</td>
		<td>上下为0左右15px</td>
	</tr>
	<tr>
		<td>.page__hd_title,page__hd_desc</td>
		<td>用于页面标题和描述</td>
	</tr>
</table>
<table>
	<tr>
		<th colspan="2">字体大小</th>
	</tr>
	<tr>
		<td>.f12</td>
		<td>font-size:12px;</td>
	</tr>
	<tr>
		<td>.f13</td>
		<td>font-size:13px</td>
	</tr>
	<tr>
		<td>.f14</td>
		<td>font-size:15px;</td>
	</tr>
	<tr>
		<td>.f15</td>
		<td>font-size:15px;</td>
	</tr>
	<tr>
		<td>.f16</td>
		<td>font-size:16px;</td>
	</tr>
	<tr>
		<td>.f17</td>
		<td>font-size:17px;</td>
	</tr>
	<tr>
		<td>.f18</td>
		<td>font-size:18px;</td>
	</tr>
	<tr>
		<td>.f20</td>
		<td>font-size:20px;</td>
	</tr>
	<tr>
		<td>.f24</td>
		<td>font-size:24px;</td>
	</tr>
	<tr>
		<td>.f26</td>
		<td>font-size:26px;</td>
	</tr>
	<tr>
		<th colspan="2">清除浮动</th>
	</tr>
	<tr>
		<td>.clear</td>
		<td>清除左右浮动</td>
	</tr>
	<!-- padding -->
	<tr>
		<th colspan="2">padding</th>
	</tr>
	<tr>
		<td>.p0</td>
		<td>padding:0;</td>
	</tr>
	<tr>
		<td>.p10</td>
		<td>padding:10px;</td>
	</tr>
	<tr>
		<td>.p15</td>
		<td>padding:15px;</td>
	</tr>
	<tr>
		<td>.ptb10</td>
		<td>padding:10px 0;</td>
	</tr>
	<tr>
		<td>.plr10</td>
		<td>padding:0 10px;</td>
	</tr>
	<tr>
		<td>.pl10</td>
		<td>padding-left:10px;</td>
	</tr>
	<tr>
		<td>.pr10</td>
		<td>padding-right:10px;</td>
	</tr>
	<tr>
		<td>.pt10</td>
		<td>padding-top:10px;</td>
	</tr>
	<tr>
		<td>.pb10</td>
		<td>padding-bottom:10px;</td>
	</tr>
	<!-- margin -->
	<tr>
		<th colspan="2">margin</th>
	</tr>
	<tr>
		<td>.m0</td>
		<td>margin:0;</td>
	</tr>
	<tr>
		<td>.m10</td>
		<td>margin:10px;</td>
	</tr>
	<tr>
		<td>.m15</td>
		<td>margin:15px;</td>
	</tr>
	<tr>
		<td>.mtb10</td>
		<td>margin:10px 0;</td>
	</tr>
	<tr>
		<td>.mlr10</td>
		<td>margin:0 10px;</td>
	</tr>
	<tr>
		<td>.ml10</td>
		<td>margin-left:10px;</td>
	</tr>
	<tr>
		<td>.mr10</td>
		<td>margin-right:10px;</td>
	</tr>
	<tr>
		<td>.mt10</td>
		<td>margin-top:10px;</td>
	</tr>
	<tr>
		<td>.mb10</td>
		<td>margin-bottom:10px;</td>
	</tr>
	<tr>
		<td>.mt-1</td>
		<td>margin-top:-1px;</td>
	</tr>
	<!-- 左中右对齐 -->
	<tr>
		<th colspan="2">文字左中右对齐</th>
	</tr>
	<tr>
		<td>.tal</td>
		<td>text-align: left;</td>
	</tr>
	<tr>
		<td>.tac</td>
		<td>text-align: cetner;</td>
	</tr>
	<tr>
		<td>.tar</td>
		<td>text-align: right;</td>
	</tr>
	<!-- 移除伪类边框 -->
	<tr>
		<th colspan="2">移除伪类边框</th>
	</tr>
	<tr>
		<td>.b-top</td>
		<td>border-top: 0!important;</td>
	</tr>
	<tr>
		<td>.b-btm</td>
		<td>border-bottom: 0!important;</td>
	</tr>
	<tr>
		<td>.b-tb</td>
		<td>border: 0!important;</td>
	</tr>
	<!-- 左右浮动 -->
	<tr>
		<th colspan="2">左右浮动</th>
	</tr>
	<tr>
		<td>.fl</td>
		<td>float:left;</td>
	</tr>
	<tr>
		<td>.fr</td>
		<td>float:right;</td>
	</tr>
</table>


				{"a":"baseline/middle/top","b":"垂直对齐方式"},
				{"a":"show/hide","b":"显示隐藏"},
				{"a":"block/inline/iblock","b":"display属性"},
				{"a":"tleft/tcenter/tright","b":"文本对齐方式"},
				{"a":"center","b":"div居中"},
				{"a":"border/dotted","b":"1px 边框实线与虚线"},
				{"a":"hand/move","b":"手样式和移动样式"},
				{"a":"u/del/-u","b":"下划线中划线无划线"},
				{"a":"i/-i","b":"斜体与正常"},
				{"a":"bold/-bold","b":"粗体,正常"},
				{"a":"wrap/-wrap","b":"换行与不换行"},
				{"a":"left/right/clear","b":"左右浮动,清除两边浮动"},
				{"a":"clearfix","b":"清除浮动"},
				{"a":"upper/lower/cap","b":"大写/小写/首字母大写"},
				{"a":"hidden/visible","b":"hidden/visible"},
				{"a":"rel/abs/fixed","b":"层定位"},
				{"a":"indent","b":"缩进20px"},
				{"a":"lheight","b":"行高22px"},
				{"a":"outline","b":"链接虚线"},
				{"a":"ell","b":"隐藏超过的文字"},
				{"a":"yahei","b":"雅黑字体"},
				{"a":"hr1","b":"1px水平线"},
				{"a":"req","b":"必填项"},
				{"a":"v-center","b":"强制垂直居中"},
				{"a":"weui-loading","b":"loading动画i元素上"},
				{"a":"loading","b":"loading小图标"} ,
				{"a":"loading2","b":"loading遮罩动画"}
				
<div class="daui-gap daui-gap_transparent"></div>
<div class="daui-footer">
	<div class="daui-footer__links">
		<a class="daui-footer__links-item" href="../index.html">DanceWeUI首页</a>
		<a class="daui-footer__links-item" href="https://gitee.com/lianlianzan/danceui" target="_blank">去码云下载</a>
	</div>
	<div class="daui-footer__text">Copyright &copy; DanceUI</div>
</div>

	<script src="js/jquery.min.js"></script>
	<script src="js/jquery-weui.min.js"></script>
</body>
</html>